<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>多益网络游戏周边商城</title>
    <link rel="stylesheet" href="/libs/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/libs/swiper/css/swiper.min.css">
    <link rel="stylesheet" href="/font/iconfont.css">
    <link rel="stylesheet" href="/css/index.css">
</head>
<body>
<div class="bg">
    <header>

    </header>
    <!-- <div class="carousel">
        <div class="carousels"> -->
            <div class="swiper-container">
                <div class="swiper-wrapper shuffling">
                    <script type="text" id="shufflingTemplate">
                        {{each list imgs}}
                        <div class="swiper-slide"><a href="/html/shopList.html?id={{imgs.cid}}"><img src="{{imgs.url}}" alt=""></a></div>
                        {{/each}}
                    </script>
                    <!-- <div class="swiper-slide"><img src="/img/index-1.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/img/index-1.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/img/index-1.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/img/index-1.jpg" alt=""></div> -->
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
                <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
        <!-- </div>
    </div> -->
    <div class="list" id="i-list">
        <div class="lists">
            <div class="one">
                <img src="/img/three-1.jpg" alt="神武4游戏周边">
            </div>
            <div class="two">
               <img src="/img/three-2.jpg" alt="新梦想世界游戏周边">
            </div>
            <div class="three">
                <img src="/img/three-3.jpg" alt="其他游戏周边">
            </div>
        </div>
    </div>
    <div class="nav list-appear" id="i-nav">
        <div class="navs">
            <span>
                <a href="/index.html">首页</a>
                >> 
            </span>
            <i>神武4游戏周边</i>
        </div>
    </div>
    <main>
        <div class="main" id="index-main">
            <div class="one" id="index-main-one">
                <script type="text.html" id="indexMainTemplate">
                    {{each product shop}}    
                        <div>
                            <a href="/html/shopList.html?id={{shop.id}}">
                                <dl>
                                    <dt><img src="{{shop.mobile_cover_img}}" alt=""></dt>
                                    <dd>
                                        {{if shop.mobile_product_name.length > 6}}
                                        <p class="p">{{shop.mobile_product_name.slice(0,6)}}...</p>
                                        {{else}} <p class="p">{{shop.mobile_product_name}}</p>
                                        {{/if}}
                                        <span>￥{{shop.product_price}}</span>
                                    </dd>
                                    <span class="x"></span>
                                </dl>
                            </a>
                        </div>
                    {{/each}}
                </script>
            </div>
            <div class="one" id="index-main-two">
                <script type="text.html" id="indexMainTemplate">
                    {{each product shop}}    
                        <div>
                            <a href="/html/shopList.html">
                                <dl>
                                    <dt><img src="{{shop.mobile_cover_img}}" alt=""></dt>
                                    <dd>
                                        {{if shop.mobile_product_name.length > 6}}
                                        <p class="p">{{shop.mobile_product_name.slice(0,6)}}...</p>
                                        {{else}} <p class="p">{{shop.mobile_product_name}}</p>
                                        {{/if}}
                                        <span>￥{{shop.product_price}}</span>
                                    </dd>
                                    <span class="x"></span>
                                </dl>
                            </a>
                        </div>
                    {{/each}}
                </script>
            </div>
            <div class="leaf">
                <ul class="pagination">
                    <li><a href="javascript:;" id="goprev">&laquo;</a></li>
                    <li data-id='1'><a href="javascript:;">1</a></li>
                    <li data-id="2"><a href="javascript:;">2</a></li>
                    <li data-id="3"><a href="javascript:;">3</a></li>
                    <li><a href="javascript:;" id="gonext">&raquo;</a></li>
                </ul>
            </div>
        </div> 
    </main>
    
    <footer>
        
    </footer>
</div>

<!-- 登录 -->
<div class="modal fade login" id="login" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title ac" id="mylogin"><a>战盟快捷登录</a></h4>
            <h4 class="modal-title" id="minelogin"><a>战盟帐号登录</a></h4>
          </div>
          <div class="modal-body ewm1">
            <img src="/img/ewm-4.gif" alt="">
            <p>使用<span>多益战盟APP</span>扫码安全登录</p>
          </div>
          <!-- <div class="modal-footer footer1 appear">
              <a href="#">下载多益战盟</a>
              <a href="#">注册战盟帐号</a>
              <a href="#">忘记密码</a>
          </div> -->
          <div class="modal-body zhanghao appear" >
              <div>
                  <i class="iconfont icon-youjian"></i>
                  <input type="text" class="log-email" placeholder="战盟账号">
              </div>
              <div>
                  <i class="iconfont icon-icon_suo-"></i>
                  <input type="password" class="log-pwd" placeholder="密码">
              </div>
              <p class="text-center text-success pc"></p>
              <button class="in-login">登录</button>
            </div>
            <div class="modal-footer footer1">
                <a href="javascript:;">下载多益战盟</a>
                <a class="lRegister" href="javascript:;">注册战盟帐号</a>
                <a href="javascript:;">忘记密码</a>
            </div>
        </div>
      </div>
</div>
  <!-- 注册 -->
<div class="modal fade register" id="register" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title ac" id="myModalLabel"><a>注册战盟账号</a></h4>
          </div>
          <div class="modal-body ordinary">
              <p>
                  <a href="javascript:;" id="zc1" class="ac">普通账号</a>
                  <a href="javascript:;" id="zc2" class="">2980账号</a>
                  <a href="javascript:;" class="right">已注册但未收到验证邮件?</a>
              </p>
          </div>
              <!-- 普通账号注册 -->
            <div class="modal-body zhanghao1" >
              <p class="pp">
                  <span>邮箱名</span>   
                  <input class="email" type="text" placeholder="6-16位字母或数字">
              </p>
              <p class="info">该帐号可登录战盟游戏和2980邮箱</p>
              <p class="err">6-16位字母或数字，必须包含字母</p>
              <p class="pp">
                  <span>登录密码</span>
                  <input type="password" class="pwd" placeholder="请输入6-16个数字或字母">
              </p>
              <p class="err">请输入6-16个数字或字母</p>
              <p class="pp">
                  <span>确认密码</span>
                  <input type="password" class="cpwd" placeholder="请再次输入登录密码">
              </p>
              <div class="p1">
                  <input type="checkbox" class="see1">
                  已阅读并同意<a href="#">服务条款</a>
              </div>
              <p class="text-center text-success reswarp" style="display: none;">注册成功,2s后转入登录页面</p>
              <div class="btn-re" style="margin-bottom:12px">
                  <input type="button" class="btn-i" id="btn-register1" value="立即注册">
              </div>
            </div>
            <!-- 2980账号注册 -->
            <div class="modal-body two2980 appear">
              <p class="pp">
                  <span>账号</span>   
                  <input class="temail" type="text" placeholder="请输入手机号或常用邮箱">
              </p>
              <p class="info">请确保邮箱真实有效，用于注册后的验证</p>
              <p class="err">请输入正确的手机号或邮箱</p>
              <p class="pp">
                  <span>登录密码</span>
                  <input type="password" class="tpwd" placeholder="请输入6-16个数字或字母">
              </p>
              <p class="err">请输入6-16个数字或字母</p>
              <p class="pp">
                  <span>确认密码</span>
                  <input type="password" class="ctpwd" placeholder="请再次输入登录密码">
              </p>
              <p class="pp">
                  <span>绑定手机</span>
                  <input type="text" class="tete" placeholder="绑定手机，可用于登录">
              </p>
              <p class="pp">
                  <span>完成验证</span>
                  <a href="javascript:void(0)" class="btn-yz" id="dy-yz">点击按钮进行验证</a>
              </p>
              <p class="pp">
                  <span>手机验证</span>
                  <a href="javascript:void(0)" class="btn-phone" id="dy-phone">获取验证码</a>
              </p>
              <div class="p1">
                  <input type="checkbox" class="see2">
                  已阅读并同意<a href="#">服务条款</a>
              </div>
              <p class="text-center text-success reswarp" style="display: none;">注册成功,2s后转入登录页面</p>
              <div class="btn-re" style="margin-bottom:12px">
                  <input type="button" class="btn-i" id="btn-register2" value="立即注册">
              </div>
            </div>
        </div>
      </div>
</div>
    <script src="/libs/require/require.js" data-main="/js/index"></script>
</body>
</html>